<!DOCTYPE html>
<html>

<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
</head>

<body>
    <div class="box">
        <div class="btnbox">
            <div style="margin: 50px">
                <form action="/demo/downloadWord" method="post"  enctype="multipart/form-data">
                <input type="file" id="file" class="button-item" name="file"></input>
                <button type="button" id="upload" class="button-item">解析内容</button>
                <button type="submit" id="download" class="button-item">下载Word</button>
                </form>
            </div>
        </div>
    </div>
<table  class="table">
    <tbody id="resultTable">
    </tbody>
</table>
</body>
<script src="/js/jquery.min.js"></script>
<script type="text/javascript">
    $('#upload').click(function () {
        var file = document.getElementById('file').files[0];
        var formData = new FormData();
        if (file != null) {
        	/*
            if(file.type != 'application/msword' && file.type != 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
                && file.type != 'application/vnd.ms-excel' && file.type != 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
                && file.type != 'application/vnd.ms-powerpoint' && file.type != 'application/vnd.openxmlformats-officedocument.presentationml.presentation'){
                alert("上传文件格式只支持word,excel,ppt");
                return;
            } */
            if(file.size > 5*1024*1024){
                alert("文件大小超过5M");
                return;

            }
            formData.append("file", file);
        }else{
            return;
        }
        $.ajax({
            url : "/demo/upload",
            type : 'POST',
            data: formData,
            // 告诉jQuery不要去处理发送的数据
            processData : false,
            // 告诉jQuery不要去设置Content-Type请求头
            contentType : false,
            success : function(str) {
                $("#resultTable").empty();
                var trList = "";

                    console.log(str);
                for (var i = 0; i < str.length; i++) {
                    //解释一下data[i],第一个[i]是获得JSONArray中的第i个Map
                    //如本方法caseList[0],是data中第一个list中的第一个Map
                    var caseList = str[i]; //获取Map
                    var tdList = "";
                    console.log(caseList);
                    trList = "<tr class='td"+i+"'></tr>";
                    $("#resultTable").append(trList);
                    for (var j = 0; j < caseList.length; j++) {
                        tdList = "<td>" + caseList[j] + "</td>";
                        console.log( caseList[j]);
                        $(".td"+i).append(tdList);
                        tdList = "";
                    }


                    trList = "";
                }
            },
        });
    });


    $('#download1').click(function () {
        var file = document.getElementById('file').files[0];
        var formData = new FormData();
        if (file != null) {

            if(file.size > 5*1024*1024){
                alert("文件大小超过5M");
                return;
            }
            formData.append("file", file);
        }else{
            return;
        }
        $.ajax({
            url : "/demo/downloadWord",
            type : 'POST',
            data: formData,
            // 告诉jQuery不要去处理发送的数据
            processData : false,
            // 告诉jQuery不要去设置Content-Type请求头
            contentType : false,
            success : function(str) {

            },
        });

        function download() {
            try {
                var queryForm = $("#queryCourseForm");
                var exportForm = $("<form action='/downCourses.do' method='post'></form>")
                exportForm.html(queryForm.html());
                $(document.body).append(exportForm);
                exportForm.submit();
            } catch (e) {
                console.log(e);
            } finally {
                exportForm.remove();
            }
        }
    });
</script>
</html>